<template>
  <div class="mpd-status-bar">
    <template v-if="messageInfo.content">
      <span>提示信息({{ messageInfo.type }})：</span>
      <span>{{ messageInfo.content }}</span>
    </template>
    <template v-else>
      <span>暂无提示</span>
    </template>
  </div>
</template>

<script lang="ts">
import { messageInfo } from '../../util/messageUtil'

export default {
  data() {
    return {
      messageInfo
    }
  }
}
</script>

<style lang="less">
.mpd-status-bar {
  height: 22px;
  line-height: 22px;
  background-color: rgb(0, 122, 204);
  color: rgb(255, 255, 255);
  font-size: var(--mpd-global-font-size);
  padding: 0 5px;
}
</style>
